<!--内边距百分比组件-->
<template>
  <div class="content-padding">
    <div class="name">内边距百分比</div>
    <el-input v-model="cssStyle.paddingPercent" placeholder="请输入宽" type="number" min="0" max="100" step="1">
      <template #append>%</template>
    </el-input>
  </div>
</template>

<script setup>
const cssStyle = defineModel("cssStyle", {
  type: Object,
  required: true,
});
</script>
<style scoped lang="less">
.content-padding {
  padding: 20px 0;
  //公共标题
  .name {
    font-size: 18px;
    color: #351d1d;
    font-weight: 400;
    margin-bottom: 14px;
  }
  :deep(.el-input) {
    width: 100%;
    height: @InputHeight;
    input {
      font-size: 18px;
      &:placeholder-shown {
        font-size: 18px;
        color: #b1b1b1;
        font-weight: 400;
      }
    }
    .el-select__wrapper {
      min-height: @InputHeight;
    }
  }
}
</style>
